//我关注的
const toggleBtn = document.querySelectorAll('.zl');
const detailModal = document.getElementById('detailModal');
const closeBtn = document.getElementById('closeBtn');
const followButtons = document.getElementById('follows');
const followButtons1 = document.getElementById('follows1');

if (followButtons) {
    console.log('初始类名:', followButtons.className);
    followButtons.addEventListener('click', function () {
        console.log('点击时类名:', this.className);
        if (this.classList.contains('follows')) {
            this.textContent = '已关注';
            this.classList.replace('follows', 'unfollows');
        } else {
            this.textContent = '+关注他';
            this.classList.replace('unfollows', 'follows');
        }
        console.log('点击后类名:', this.className);
    });

    followButtons.addEventListener('mouseover', function () {
        if (this.classList.contains('unfollows')) {
            this.textContent = '取消关注';
        }
    });

    followButtons.addEventListener('mouseout', function () {
        if (this.classList.contains('unfollows')) {
            this.textContent = '已关注';
        }
    });
}
//关注我的
if (followButtons1) {
    // 设置初始类名
    followButtons1.className = 'unfollows1';
    console.log('初始类名:', followButtons1.className);
    followButtons1.addEventListener('click', function () {
        console.log('点击时类名:', this.className);
        if (this.classList.contains('unfollows1')) {
            this.textContent = '+关注他';
            this.classList.replace('unfollows1', 'follows1');
        } else {
            this.textContent = '已关注';
            this.classList.replace('follows1', 'unfollows1');
        }
        console.log('点击后类名:', this.className);
    });

    followButtons1.addEventListener('mouseover', function () {
        if (this.classList.contains('unfollows1')) {
            this.textContent = '取消关注';
        }
    });

    followButtons1.addEventListener('mouseout', function () {
        if (this.classList.contains('unfollows1')) {
            this.textContent = '已关注';
        }
    });
}
//举报
document.addEventListener('DOMContentLoaded', function () {
    const reportButton1 = document.getElementById('report1');
    const reportButtons = document.querySelectorAll('.report');
    const reportModal = document.getElementById('reportModal');
    const closeButton2 = document.querySelector('.close2');
    const submitReportButton = document.getElementById('submitReport');
    const reportTypeButtons = document.querySelectorAll('.report-type');

    // 打开模态框的函数
    function openReportModal() {
        reportModal.style.display = 'block';
    }

    // 关闭模态框的函数
    function closeReportModal() {
        reportModal.style.display = 'none';
        resetReportButtons();
    }

    // 重置举报类型按钮和提交按钮状态的函数
    function resetReportButtons() {
        reportTypeButtons.forEach(button => button.classList.remove('active'));
        submitReportButton.classList.remove('active');
        submitReportButton.disabled = true;
    }

    // 为 reportButton1 绑定点击事件
    reportButton1.addEventListener('click', openReportModal);

    // 为所有类名为 report 的按钮绑定点击事件
    reportButtons.forEach(button => {
        button.addEventListener('click', openReportModal);
    });

    // 为关闭按钮绑定点击事件
    closeButton2.addEventListener('click', closeReportModal);

    // 点击模态框外部关闭模态框
    window.addEventListener('click', function (event) {
        if (event.target === reportModal) {
            closeReportModal();
        }
    });

    // 为举报类型按钮绑定点击事件
    reportTypeButtons.forEach(button => {
        button.addEventListener('click', function () {
            reportTypeButtons.forEach(otherButton => otherButton.classList.remove('active'));
            this.classList.add('active');
            submitReportButton.classList.add('active');
            submitReportButton.disabled = false;
        });
    });

    // 初始时禁用提交按钮
    submitReportButton.disabled = true;

    // 为提交按钮绑定点击事件
    submitReportButton.addEventListener('click', function () {
        if (!this.disabled) {
            alert('举报已提交');
            closeReportModal();
        }
    });
});
//切换动态，文章，专栏.....
const contentBoxes = document.querySelectorAll('.dongtai, .talk, .question, .article, .idea, .video, .collect, .attention');
const questionContainer = document.querySelector('.question-container');
const actionItems = document.querySelectorAll('ul.icon li');
const listItems = document.querySelectorAll('ul li:not(.icon li)');
console.log('listItems数量:', listItems.length);
console.log('contentBoxes数量:', contentBoxes.length);

// 事件委托在父元素上
const parentUl = document.querySelector('ul.icon');
parentUl.addEventListener('click', (event) => {
    const target = event.target;
    if (target.tagName === 'LI') {
        if (target.id ==='report') {
            // 举报按钮逻辑
            const reportModal = document.getElementById('reportModal');
            if (reportModal) {
                reportModal.style.display = 'block';
            }
        } else {
            // 其他“赞同”“评论”等按钮逻辑，可按需添加
        }
    }
});
const boxa = document.querySelector('ul.icon');
listItems.forEach((item, index) => {
    item.addEventListener('click', () => {
        // 移除所有 li 的 active 类
        listItems.forEach((li) => {
            li.classList.remove('active');
        });
        // 隐藏所有内容盒子
        contentBoxes.forEach((box) => {
            box.style.display = 'none';
        });
        questionContainer.style.display = 'none';

        // 给当前点击的 li 添加 active 类
        item.classList.add('active');
        // 根据点击的 li 的索引，显示对应的内容盒子
        const targetBoxIndex = index;
        const targetBox = contentBoxes[targetBoxIndex];
        if (targetBox) {
            targetBox.style.display = 'block';
            if (targetBox.classList.contains('dongtai')) {
                questionContainer.style.display = 'block';
            }
        }
    });
});
const clickableItems = document.querySelectorAll('.icon1.action-item.clickable');
clickableItems.forEach(item => {
    item.addEventListener('click', function () {
        this.classList.toggle('clicked');
    });
});
//关注的人
document.addEventListener('DOMContentLoaded', function () {
    // 获取所有的选项卡元素
    const tabItems = document.querySelectorAll('.tab-item');
    // 获取所有的内容项元素
    const contentItems = document.querySelectorAll('.content-item');

    // 为每个选项卡元素添加点击事件监听器
    tabItems.forEach((tabItem, index) => {
        tabItem.addEventListener('click', function () {
            // 移除所有选项卡的 active 类
            tabItems.forEach(item => item.classList.remove('active'));
            // 为当前点击的选项卡添加 active 类
            this.classList.add('active');

            // 移除所有内容项的 active 类
            contentItems.forEach(item => item.classList.remove('active'));
            // 为对应的内容项添加 active 类
            contentItems[index].classList.add('active');
        });
    });
});
document.addEventListener('DOMContentLoaded', function () {
    const readmoreList = document.querySelectorAll('.read-more');

    readmoreList.forEach((readmore, index) => {
        const yincangwenzi = document.querySelectorAll('.yc-word')[index];
        const souqi = document.querySelectorAll('.suouoqi')[index];
        const point = document.querySelectorAll('.point')[index];

        if (yincangwenzi && souqi && point) {
            const yincangwenziText = yincangwenzi.textContent;
            const initialPointText = point.textContent;

            readmore.addEventListener('click', function () {
                readmore.style.display = 'none';
                point.textContent = yincangwenziText;
                souqi.style.display = 'block';
            });

            souqi.addEventListener('click', function () {
                readmore.style.display = 'block';
                point.textContent = initialPointText;
                souqi.style.display = 'none';
            });
        }
    });
});